.b {
    background-color: rgba(0, 0, 255, 0.2);
}
.y {
    background-color: rgba(255, 255, 0, 0.2);
}
.g {
    background-color: rgba(0, 255, 0, 0.2);
}

/* borders */
.border {
    border: solid 1px rgb(215, 215, 215);
}

.border-t {
    border-top: solid 1px rgb(215, 215, 215);
}

.border-b {
    border-bottom: solid 1px rgb(215, 215, 215);
}

.border-l {
    border-left: solid 1px rgb(215, 215, 215);
}

.border-r {
    border-right: solid 1px rgb(215, 215, 215);
}

/* shadows */
.shadows {
    -moz-box-shadow:2px 2px 10px 0px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow:2px 2px 10px 0px rgba(0, 0, 0, 0.5);
    box-shadow:2px 2px 10px 0px rgba(0, 0, 0, 0.5);
}


/* buttons */

.trans-btn {
    width: 28px;
    height: 28px;
    padding: 0px;

    background-color: transparent;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    
    border: solid 1px rgb(245, 245, 245);
}

    .trans-btn:hover {
        border: solid 1px rgb(215, 215, 215);
    }

    .trans-btn:active {
        background-color: rgb(230, 230, 230);
    }


/* common */
.hidden {
    display: none;
}

.hide-overflow {
    overflow: hidden;
}

.auto-overflow {
    overflow-x: hidden;
    overflow-y: auto;
}

.float-r {
    float: right;
}

.float-l {
    float: left;
}

.cont {
    position: relative;
    min-height: 100%;
}

.fillsize {
    width: 100%;
    height: 100%;
}

.fillwidth {
    width: 100%;
    min-height: 100%;
}


/* images */
.loading {
    background-image: url("../resources/images/loading.gif");
    background-size: 80% 80%;
    background-repeat: no-repeat;
    background-position: center center;
}


/* tables */
.datagrid table
{
	border-collapse: collapse;
	text-align: left;
	width: 100%;
}

.datagrid
{
	background: #fff;
	border: 1px solid #DEDEDE;
	font: normal 14px/150% Calibri, sans-serif;
	overflow: hidden;
}

.datagrid table td, .datagrid table th
{
    padding: 1px;
	padding-left: 10px;
}

.datagrid table thead th
{
	background: -moz-linear-gradient( center top, #F5F5F5 5%, #D4D4D4 100% );
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #F5F5F5), color-stop(1, #D4D4D4) );
	background-color: #F5F5F5;
	border-left: 1px solid #DBDBDB;
	color: #000000;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#D4D4D4');
	font-weight: normal;
}

.datagrid table thead th:first-child
{
	border: none;
}

.datagrid table tbody td
{
	border-bottom: 1px solid #DBDBDB;
	border-left: 1px solid #DBDBDB;
	color: #000000;
	font-weight: normal;
}

.datagrid table tbody .alt td
{
	background: #F5F5F5;
	color: #000000;
}

.datagrid table tbody td:first-child
{
	border-left: none;
}

.datagrid table tbody tr:last-child td
{
	border-bottom: none;
}

.datagrid table tfoot td div
{
	background: #EBEBEB;
	border-top: 1px solid #DEDEDE;
}

.datagrid table tfoot td
{
	font-size: 12px;
	padding: 0;
}

.datagrid table tfoot td div
{
	padding: 2px;
}

.datagrid table tfoot td ul
{
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: right;
}

.datagrid table tfoot li
{
	display: inline;
}

.datagrid table tfoot li a
{
	background: -moz-linear-gradient( center top, #8C8C8C 5%, #7D7D7D 100% );
	background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #8C8C8C), color-stop(1, #7D7D7D) );
	background-color: #8C8C8C;
	border: 1px solid #8C8C8C;
	border-radius: 3px;
	color: #F5F5F5;
	display: inline-block;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#8C8C8C', endColorstr='#7D7D7D');
	margin: 1px;
	-moz-border-radius: 3px;
	padding: 2px 8px;
	text-decoration: none;
	-webkit-border-radius: 3px;
}

.datagrid table tfoot ul.active, .datagrid table tfoot ul a:hover
{
	background: none;
	background-color: #8C8C8C;
	border-color: #7D7D7D;
	color: #F5F5F5;
	text-decoration: none;
}



/* resources */
.area {
    border: solid 1px rgba(0, 0, 0, 0.4);
    z-index: 100;
}

.inner {
    width: 100%;
    height: 100%;
}

.text-resource, .image-resource, .video-resource {
    
    z-index:99;

    border: solid 1px rgb(215, 215, 215);

    -moz-box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.5);
    box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.5);
}

.text-resource {
    text-align: center;
    display: table;
}

    .text-resource .inner {
        background-color: transparent;
        margin: 10px;
        display: table-cell;
    }

.image-resource {
    background-position: center center;
}

    .video-resource .inner {
        background-color: rgb(10, 10, 10);
    }